<template>
    <div class="toolbar">
      <div class="head">
        <div class="left">{{pageSetting.title}}</div>
        <div class="right">
          <a-switch v-model="pageSetting.isGrid" checked-children="显示辅助网格" un-checked-children="隐藏辅助网格"></a-switch>
          <a-button
            v-for="item in buttonList"
            :key="item.type"
            @click="()=> handleClick(item.onClick)"
            :title="item.name"
            :disabled="getDisabled(item.disabled)"
          >{{item.name}}</a-button>
        </div>
      </div>
      
      <SaveAs />
    </div>
</template>

<script >

import { mapState } from "vuex"
import getButnList from "./buttonList"
import SaveAs from "./SaveAs"

export default {
  data() {
    return {
      buttonList: getButnList(["prev", "next", "copy", "shear", "delete", "deleteAll", "reset", "save", "saveAs", "preview"])
    }
  },
  methods: {
    handleClick(callback){
      callback(this)
    },
    getDisabled(callback){
      return callback(this)
    }
  },
  computed: {
    ...mapState("lowCode", {
      pageSetting: state => state.pageSetting
    })
  },
  components: {
    SaveAs
  }
}
</script>

<style lang="less" scoped>
 @import url("./index.less");
</style>
